<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./index.css">

</head>

<body>
    <div class="box">
        <!-- 标题列表 -->
        <ul class="tilteList">
            <li>
                <h4>小米手机</h4>
                <ul class="main">
                    <li>
                        <a href="">
                            <img src="./img/手机1.webp" alt="">
                            <p>小米手机</p>
                            <span>1999元</span>
                        </a>
                    </li>
                    <li>
                        <a href="">
                            <img src="./img/手机2.webp" alt="">
                            <p>小米手机</p>
                            <span>1999元</span>
                        </a>
                    </li>
                    <li>
                        <a href="">
                            <img src="./img/手机3.webp" alt="">
                            <p>小米手机</p>
                            <span>1999元</span>
                        </a>
                    </li>
                    <li>
                        <a href="">
                            <img src="./img/手机4.webp" alt="">
                            <p>小米手机</p>
                            <span>1999元</span>
                        </a>
                    </li>
                </ul>
            </li>
            <li>
                <h4>Redmi手机</h4>
                <ul class="main">
                    <li>
                        <a href="">
                            <img src="./img/红米1.png" alt="">
                            <p>红米手机</p>
                            <span>999元</span>
                        </a>
                    </li>
                    <li>
                        <a href="">
                            <img src="./img/红米2.png" alt="">
                            <p>红米手机</p>
                            <span>999元</span>
                        </a>
                    </li>
                    <li>
                        <a href="">
                            <img src="./img/红米3.png" alt="">
                            <p>红米手机</p>
                            <span>999元</span>
                        </a>
                    </li>
                    <li>
                        <a href="">
                            <img src="./img/红米4.png" alt="">
                            <p>红米手机</p>
                            <span>999元</span>
                        </a>
                    </li>
                </ul>
            </li>
            <!-- <li>
                <h4>电视</h4>
                <ul class="main">
                    <li>
                        <a href="">
                            <img src="./img/电视1.webp" alt="">
                            <p>电视</p>
                            <span>4999元</span>
                        </a>
                    </li>
                    <li>
                        <a href="">
                            <img src="./img/电视2.webp" alt="">
                            <p>电视</p>
                            <span>4999元</span>
                        </a>
                    </li>
                    <li>
                        <a href="">
                            <img src="./img/电视3.webp" alt="">
                            <p>电视</p>
                            <span>4999元</span>
                        </a>
                    </li>
                    <li>
                        <a href="">
                            <img src="./img/电视4.webp" alt="">
                            <p>电视</p>
                            <span>4999元</span>
                        </a>
                    </li>
                </ul>
            </li> -->
            <li>
                <h4>笔记本</h4>
                <ul class="main">
                    <li>
                        <a href="">
                            <img src="./img/电脑1.png" alt="">
                            <p>电脑</p>
                            <span>6999元</span>
                        </a>
                    </li>
                    <li>
                        <a href="">
                            <img src="./img/电脑2.png" alt="">
                            <p>电脑</p>
                            <span>6999元</span>
                        </a>
                    </li>
                    <li>
                        <a href="">
                            <img src="./img/电脑3.png" alt="">
                            <p>电脑</p>
                            <span>6999元</span>
                        </a>
                    </li>
                    <li>
                        <a href="">
                            <img src="./img/电脑3.png" alt="">
                            <p>电脑</p>
                            <span>6999元</span>
                        </a>
                    </li>
                </ul>
            </li>
        </ul>
    </div>

    <script src="./index.js"></script>
</body>

</html>